// DOM元素
const videoModal = document.querySelector('.video-modal');
const videoPlayer = document.getElementById('video-player');
const videoTitle = document.getElementById('video-title');
const closeVideoModal = document.querySelector('.video-modal .close-modal');
const videoThumbs = document.querySelectorAll('.video-thumb');
const sliderContainer = document.querySelector('.slider-container');
const slides = document.querySelectorAll('.slide');
const dots = document.querySelectorAll('.dot');
const prevBtn = document.querySelector('.prev-btn');
const nextBtn = document.querySelector('.next-btn');
const cgItems = document.querySelectorAll('.cg-item');

// 视频数据（示例路径，需替换为实际视频地址）
const videos = [
  {
    title: '王者荣耀 - 海诺与朵莉亚动画',
    src: 'videos/cg1.mp4',
    thumb: 'images/cg1.png'
  },
  {
    title: '和平精英 - 沙漠战场',
    src: 'videos/cg2.mp4',
    thumb: 'images/cg2.png'
  },
  {
    title: '金铲铲之战 - 新英雄',
    src: 'videos/cg3.mp4',
    thumb: 'images/cg3.png'
  },
  {
    title: '宫本武藏-阿通',
    src: 'videos/cg4.mp4',
    thumb: 'images/cg4.png'
  }
 
];



// 切换到下一张幻灯片
function nextSlide() {
  currentSlide = (currentSlide + 1) % slides.length;
  updateSlider();
}

// 切换到上一张幻灯片
function prevSlide() {
  currentSlide = (currentSlide - 1 + slides.length) % slides.length;
  updateSlider();
}

// 更新轮播图
function updateSlider() {
  // 确保sliderContainer宽度正确
  sliderContainer.style.width = `${slides.length * 100}%`;
  
  // 设置每个slide的宽度
  slides.forEach(slide => {
    slide.style.width = `${100 / slides.length}%`;
  });
  
  // 应用转换
  sliderContainer.style.transform = `translateX(-${currentSlide * 100}%)`;
  
  // 更新指示点
  dots.forEach((dot, index) => {
    if (index === currentSlide) {
      dot.classList.add('active');
    } else {
      dot.classList.remove('active');
    }
  });
}

// 轮播图自动播放
function startAutoPlay() {
  autoPlayInterval = setInterval(nextSlide, 5000); // 3秒间隔
}

// 根据标题查找视频
function findVideoByTitle(title) {
  return videos.find(video => video.title === title);
}

// 初始化事件监听器
function initEventListeners() {
  // 关闭视频模态框
  closeVideoModal.addEventListener('click', () => closeModal(videoModal));
  
  // 轮播图控制
  dots.forEach((dot, index) => {
    dot.addEventListener('click', () => {
      currentSlide = index;
      updateSlider();
    });
  });
  
  prevBtn.addEventListener('click', prevSlide);
  nextBtn.addEventListener('click', nextSlide);
  
  // 视频缩略图点击
  cgItems.forEach(item => {
    item.addEventListener('click', () => {
      const videoTitle = item.getAttribute('data-video');
      const video = findVideoByTitle(videoTitle);
      if (video) {
        showVideoModal(video.title, video.src);
      } else {
        alert('无法找到对应的视频');
      }
    });
  });
  
  // 键盘导航
  document.addEventListener('keydown', (e) => {
    if (e.key === 'ArrowLeft') {
      prevSlide();
    } else if (e.key === 'ArrowRight') {
      nextSlide();
    } else if (e.key === 'Escape') {
      if (videoModal.classList.contains('active')) {
        closeModal(videoModal);
      }
    }
  });
  
  // 模态框外部点击关闭
  videoModal.addEventListener('click', (e) => {
    if (e.target === videoModal) {
      closeModal(videoModal);
    }
  });
}

// 初始化轮播图
function initCarousel() {
  // 确保轮播图容器有正确的样式
  sliderContainer.style.display = 'flex';
  sliderContainer.style.transition = 'transform 0.5s ease-in-out';
  
  // 初始化轮播图
  updateSlider();
  
  // 启动自动播放
  startAutoPlay();
  
  // 鼠标悬停暂停自动播放
  sliderContainer.addEventListener('mouseenter', () => {
    clearInterval(autoPlayInterval);
  });
  
  sliderContainer.addEventListener('mouseleave', () => {
    startAutoPlay();
  });
}

// 初始化视频数据
function initVideoData() {
  // 为CG动画项目添加data-video属性
  cgItems.forEach((item, index) => {
    const title = item.querySelector('h3').textContent;
    item.setAttribute('data-video', title);
  });
}

// 初始化应用
function initApp() {
  initEventListeners();
  initCarousel();
  initVideoData();
  
  // 添加悬停效果
  videoThumbs.forEach(thumb => {
    thumb.style.cursor = 'pointer';
  });
  
  cgItems.forEach(item => {
    item.style.cursor = 'pointer';
  });
  
  // 确保模态框默认隐藏
  videoModal.classList.remove('active');
}

// 文档加载完成后初始化应用
document.addEventListener('DOMContentLoaded', initApp);
